﻿    $(function() {

		//RGB to HEX
		function colorToHex(color) {
			if (color.substr(0, 1) === '#') {
				return color;
			}
			var digits = /(.*?)rgb\((\d+), (\d+), (\d+)\)/.exec(color);
			
			var red = parseInt(digits[2]);
			var green = parseInt(digits[3]);
			var blue = parseInt(digits[4]);
			
			var rgb = blue | (green << 8) | (red << 16);
			return digits[1] + '#' + rgb.toString(16);
		};
		
		//color --------------------------
		function pSwatches(pContainer, bgTopColor, bgBottomColor, fontColor, borderColor, boxShadowColor, textShadowColor) {
			var p = [bgTopColor, bgBottomColor, fontColor, borderColor, boxShadowColor, textShadowColor];
			pContainer.push(p);
			return pContainer;
		}

		var pArray = []; // This array includes predefined colors for default palettes
		pArray = pSwatches(pArray, '#ededed','#dfdfdf','#777777','#dcdcdc','#ffffff','#ffffff'); // Grey
		pArray = pSwatches(pArray, '#fe1a00','#ce0100','#ffffff','#d83526','#f29c93','#b23e35'); // Red
		pArray = pSwatches(pArray, '#77d42a','#5cb811','#306108','#268a16','#caefab','#aade7c'); // Green
		pArray = pSwatches(pArray, '#79bbff','#378de5','#ffffff','#84bbf3','#bbdaf7','#528ecc'); // Blue
		pArray = pSwatches(pArray, '#ffc477','#fb9e25','#ffffff','#eeb44f','#fce2c1','#cc9f52'); // Orange
		pArray = pSwatches(pArray, '#c123de','#a20dbd','#ffffff','#a511c0','#e184f3','#9b14b3'); // Purple
		pArray = pSwatches(pArray, '#c579ff','#a341ee','#ffffff','#a946f5','#e6cafc','#8628ce'); // Purple
		pArray = pSwatches(pArray, '#f0c911','#f2ab1e','#c92200','#e65f44','#f9eca0','#ded17c'); // Orange
		pArray = pSwatches(pArray, '#9dce2c','#8cb82b','#ffffff','#83c41a','#c1ed9c','#689324'); // Green
		pArray = pSwatches(pArray, '#f24537','#c62d1f','#ffffff','#d02718','#f5978e','#810E05'); // Red
		pArray = pSwatches(pArray, '#fae4bd','#eac380','#ffffff','#eeb44f','#fcf8f2','#cc9f52'); // Orange
		pArray = pSwatches(pArray, '#ff5bb0','#ef027d','#ffffff','#ee1eb5','#fbafe3','#c70067'); // Pink
		pArray = pSwatches(pArray, '#79bbff','#4197ee','#ffffff','#469df5','#cae3fc','#287ace'); // Blue
		pArray = pSwatches(pArray, '#f9f9f9','#e9e9e9','#666666','#dcdcdc','#ffffff','#ffffff'); // Grey
		pArray = pSwatches(pArray, '#f6b33d','#d29105','#ffffff','#eda933','#fed897','#cd8a15'); // Orange
		pArray = pSwatches(pArray, '#b8e356','#a5cc52','#ffffff','#83c41a','#d9fbbe','#86ae47'); // Green
		pArray = pSwatches(pArray, '#3d94f6','#1e62d0','#ffffff','#337fed','#97c4fe','#1570cd'); // Blue
		pArray = pSwatches(pArray, '#a53df6','#7c16cb','#ffffff','#9c33ed','#d197fe','#7d15cd'); // Purple
		pArray = pSwatches(pArray, '#ffce79','#eeaf41','#ffffff','#eeb44f','#fceaca','#ce8e28'); // Orange
		pArray = pSwatches(pArray, '#eea1fc','#d441ee','#ffffff','#dd5df4','#f4cafc','#b63dcc'); // Pink
		pArray = pSwatches(pArray, '#63b8ee','#468ccf','#14396a','#3866a3','#bee2f9','#7cacde'); // Blue
		pArray = pSwatches(pArray, '#ffec64','#ffab23','#333333','#ffaa22','#fff6af','#ffee66'); // Orange
		pArray = pSwatches(pArray, '#fa665a','#d34639','#ffffff','#d83526','#fab3ad','#98231a'); // Red
		pArray = pSwatches(pArray, '#f1bdfa','#da80ea','#ffffff','#e284f3','#f6dcfb','#b952cc'); // Pink
		pArray = pSwatches(pArray, '#fc8d83','#e4685d','#ffffff','#d83526','#f7c5c0','#b23e35'); // Red
		pArray = pSwatches(pArray, '#ffffff','#f6f6f6','#666666','#dcdcdc','#ffffff','#ffffff'); // Grey
		pArray = pSwatches(pArray, '#89c403','#77a809','#ffffff','#74b807','#a4e271','#528009'); // Green
		pArray = pSwatches(pArray, '#bddbfa','#80b5ea','#ffffff','#84bbf3','#dcecfb','#528ecc'); // Blue
		pArray = pSwatches(pArray, '#dfbdfa','#bc80ea','#ffffff','#c584f3','#efdcfb','#9752cc'); // Purple
		pArray = pSwatches(pArray, '#da3df6','#b51ed0','#ffffff','#d133ed','#ee97fe','#b115cd'); // Pink

		// get color
		function bgTopColor() 		{ return colorToHex($( "#bgTopColor" ).css("background-color")) };
		function bgBottomColor() 	{ return colorToHex($( "#bgBottomColor" ).css("background-color")) };
		function fontColor() 		{ return colorToHex($( "#fontColor" ).css("background-color")) };
		function borderColor() 		{ return colorToHex($( "#borderColor" ).css("background-color")) };
		function boxShadowColor() 	{ return colorToHex($( "#boxShadowColor" ).css("background-color")) };
		function textShadowColor() 	{ return colorToHex($( "#textShadowColor" ).css("background-color")) };
		function bgGradient()		{ return $( "#slider-gradient" ).val() };
		
		// get size
		function borderSize() 		{ return $("#border-size").val() };
		
		$('#bg_color_00').mouseover(function() {
			$('#panel').css("background-image" , $("#bg_color_00").css("background-image"));
			$('#logo').css("color" , "#777777");
		});
		$('#bg_color_01').mouseover(function() {
			$('#panel').css("background-image" , $("#bg_color_01").css("background-image"));
			$('#logo').css("color" , "#005c9c");
		});
		$('#bg_color_02').mouseover(function() {
			$('#panel').css("background-image" , $("#bg_color_02").css("background-image"));
			$('#logo').css("color" , "#690000");
		});
		$('#bg_color_03').mouseover(function() {
			$('#panel').css("background-image" , $("#bg_color_03").css("background-image"));
			$('#logo').css("color" , "#427f00");
		});
		
		$('#bgTopColor').ColorPicker({
			color: bgTopColor(),
			onChange: function (hsb, hex, rgb) {
				$("#bgTopColor").css('background-Color', '#' + hex);
				background_color();
			}
		});
		$('#bgBottomColor').ColorPicker({
			color: bgBottomColor(),
			onChange: function (hsb, hex, rgb) {
				$("#bgBottomColor").css('background-Color', '#' + hex);
				background_color();
			}
		});
		$('#fontColor').ColorPicker({
			color: fontColor(),
			onChange: function (hsb, hex, rgb) {
				$("#fontColor").css('background-Color', '#' + hex);
				$( "#target_btn" ).css("color",	fontColor );
				code_result();
			}
		});
		$('#borderColor').ColorPicker({
			color: borderColor(),
			onChange: function (hsb, hex, rgb) {
				$("#borderColor").css('background-Color', '#' + hex);
				$( "#target_btn" ).css("border", "solid " + borderSize() + "px " + borderColor);
				$( "#target_btn" ).css("border-color", borderColor);
				code_result();
			}
		});
		$('#boxShadowColor').ColorPicker({
			color: boxShadowColor(),
			onChange: function (hsb, hex, rgb) {
				$("#boxShadowColor").css('background-Color', '#' + hex);
				shadow_box();
			}
		});
		$('#textShadowColor').ColorPicker({
			color: textShadowColor(),
			onChange: function (hsb, hex, rgb) {
				$("#textShadowColor").css('background-Color', '#' + hex);
				shadow_text();
			}
		});

		
		$( "#target_btn" ).mouseenter(function(){
			bgGradient_Top 		= Number(bgGradient()) + 5;
			bgGradient_Bottom 	= 100 - Number(bgGradient());
			//hover
			$( "#target_btn" ).css("background",		"-moz-linear-gradient( center top, "+bgBottomColor()+" "+bgGradient_Top+"%, "+bgTopColor()+" "+bgGradient_Bottom+"% )" );
			$( "#target_btn" ).css("background",		"-ms-linear-gradient( top, "+bgBottomColor()+" "+bgGradient_Top+"%, "+bgTopColor()+" "+bgGradient_Bottom+"%)" );
			$( "#target_btn" ).css("background",		"filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='"+bgBottomColor()+"', endColorstr='"+bgTopColor()+"')" );
			$( "#target_btn" ).css("background",		"-webkit-gradient( linear, left top, left bottom, color-stop("+bgGradient_Top+"%, "+bgBottomColor()+"), color-stop("+bgGradient_Bottom+"%, "+bgTopColor()+") )" );
		});
		
		$( "#target_btn" ).mouseout(function(){
			bgGradient_Top 		= Number(bgGradient()) + 5;
			bgGradient_Bottom 	= 100 - Number(bgGradient());
			//origin
			$( "#target_btn" ).css("background",		"-moz-linear-gradient( center top, "+bgTopColor()+" "+bgGradient_Top+"%, "+bgBottomColor()+" "+bgGradient_Bottom+"% )" );
			$( "#target_btn" ).css("background",		"-ms-linear-gradient( top, "+bgTopColor()+" "+bgGradient_Top+"%, "+bgBottomColor()+" "+bgGradient_Bottom+"%)" );
			$( "#target_btn" ).css("background",		"filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='"+bgTopColor()+"', endColorstr='"+bgBottomColor()+"')" );
			$( "#target_btn" ).css("background",		"-webkit-gradient( linear, left top, left bottom, color-stop("+bgGradient_Top+"%, "+bgTopColor()+"), color-stop("+bgGradient_Bottom+"%, "+bgBottomColor()+") )" );
		});

		$( "#color_theme" )
            .button()
            .click(function() {
                $( "#color_theme_dialog" ).dialog( "open" );
            });

        $( "#color_theme_dialog" ).dialog({
            autoOpen: false,
			resizable: false,
            height: 330,
            width: 620,
            modal: true
        });
		
		$( "#color_theme_dialog span").click(function() {
			class_name = $(this).attr('class');
			class_num  = Number(class_name.substr(5,2));
			
			$( "#bgTopColor" )		.css("background-color", pArray[class_num][0] );	$('#bgTopColor')		.ColorPickerSetColor( bgTopColor() );
			$( "#bgBottomColor" )	.css("background-color", pArray[class_num][1] );	$('#bgBottomColor')		.ColorPickerSetColor( bgBottomColor() );
			$( "#fontColor" )		.css("background-color", pArray[class_num][2] );	$('#fontColor')			.ColorPickerSetColor( fontColor() );
			$( "#borderColor" )		.css("background-color", pArray[class_num][3] );	$('#borderColor')		.ColorPickerSetColor( borderColor() );
			$( "#boxShadowColor" )	.css("background-color", pArray[class_num][4] );	$('#boxShadowColor')	.ColorPickerSetColor( boxShadowColor() );
			$( "#textShadowColor" )	.css("background-color", pArray[class_num][5] );	$('#textShadowColor')	.ColorPickerSetColor( textShadowColor() );

			tmp7 = $("#border-size").val();

			$( "#target_btn" ).css("border", "solid " + tmp7 + "px " + borderColor);
			$( "#target_btn" ).css("border-color", borderColor);

			$( "#target_btn" ).css("color",	fontColor );

			background_color();
			shadow_text();
			shadow_box();

			$( "#color_theme_dialog" ).dialog("close");
		});

        $( "#slider_gradient" ).slider({
            min: 0,
            max: 100,
            value: $('#slider-gradient').val(),
            slide: function( event, ui ) {
                $( "#slider-gradient" ).val( ui.value );
				background_color();
				code_result();
            }
		});

		//basic --------------------------
		function background_color() {
			//console.log(bgGradient());
			bgGradient_Top 		= Number(bgGradient()) + 5;
			bgGradient_Bottom 	= 100 - Number(bgGradient());
			$( "#target_btn" ).css("background-color", bgTopColor() );
			$( "#target_btn" ).css("background",		"-moz-linear-gradient( center top, "+bgTopColor()+" "+bgGradient_Top+"%, "+bgBottomColor()+" "+bgGradient_Bottom+"% )" );
			$( "#target_btn" ).css("background",		"-ms-linear-gradient( top, "+bgTopColor()+" "+bgGradient_Top+"%, "+bgBottomColor()+" "+bgGradient_Bottom+"%)" );
			$( "#target_btn" ).css("background",		"filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='"+bgTopColor()+"', endColorstr='"+bgBottomColor()+"')" );
			$( "#target_btn" ).css("background",		"-webkit-gradient( linear, left top, left bottom, color-stop("+bgGradient_Top+"%, "+bgTopColor()+"), color-stop("+bgGradient_Bottom+"%, "+bgBottomColor()+") )" );
			code_result();
		}

		$("#target_btn").html( $("#btn_text").val() );

		$('#btn_text').keyup(function() {
		  $("#target_btn").html( $(this).val() );
		  code_result();
		});

		$('#btn_class').keyup(function() {
		  code_result();
		});
		
		$('#btn_font').change(function() {
		  $( "#target_btn" ).css("font-family", $("#btn_font").val());
		  code_result();
		});

		$( "#btn_bold" ).button().click(function() {
			tmp = "normal";
			if($("#btn_bold").is(":checked")){
				tmp = "bold";
			}
			$( "#target_btn" ).css("font-weight", tmp);
			code_result();
		});
		
		// size ---------------------------
		$( "#slider_font_size" ).slider({
            min: 8,
            max: 28,
            value: $('#font-size').val(),
            slide: function( event, ui ) {
                $( "#font-size" ).val( ui.value );
				$( "#target_btn" ).css("font-size", ui.value);
				code_result();
				
				if(ui.value < 12){
					$("#smaller_then_12").show("slide", {direction: "up"}, 1000);
				}else{
					$("#smaller_then_12").hide("slide", {direction: "up"}, 1000);
				}
            }
		});

        $( "#slider_boder_radius" ).slider({
            min: 0,
            max: 42,
            value: $('#boder-radius').val(),
            slide: function( event, ui ) {
                $( "#boder-radius" ).val( ui.value );
				$( "#target_btn" ).css("-webkit-border-radius", ui.value);
				$( "#target_btn" ).css("-moz-border-radius", ui.value);
				$( "#target_btn" ).css("border-radius", ui.value);
				code_result();
            }
		});

        $( "#slider_boder_size" ).slider({
            min: 0,
            max: 12,
            value: $('#boder-size').val(),
            slide: function( event, ui ) {
                $( "#boder-size" ).val( ui.value );
				$( "#target_btn" ).css("border", "solid " + ui.value + "px " + borderColor());
				code_result();
            }
		});

        $( "#slider_vertical_size" ).slider({
            min: 0,
            max: 32,
            value: $( "#vertical-size" ).val(),
            slide: function( event, ui ) {
				tmp = $("#horizontal-size").val();
                $( "#vertical-size" ).val( ui.value );
				$( "#target_btn" ).css("padding", ui.value + "px " + tmp + "px" );
				code_result();
            }
		});

        $( "#slider_horizontal_size" ).slider({
            min: 0,
            max: 76,
            value: $( "#horizontal-size" ).val(),
            slide: function( event, ui ) {
				tmp = $("#vertical-size").val();
                $( "#horizontal-size" ).val( ui.value );
				$( "#target_btn" ).css("padding", tmp + "px " + ui.value + "px" );
				code_result();
            }
		});
		
		// shadow (text) ---------------------------
		function shadow_text() {
			if(!$("#use_shadow_text").is(":checked")){
				$( "#target_btn" ).css("text-shadow","0px 0px 0px #000");
				code_result();
				return;
			}

			tmp1 = $("#horizontal-position").val();
			tmp2 = $("#vertical-position").val();
			tmp3 = $("#blur-radius").val();
			$( "#target_btn" ).css("text-shadow", tmp1 + "px " + tmp2 + "px " + tmp3 + "px " + $( "#textShadowColor" ).css("background-color")  );
			code_result();
		};
		
        $( "#slider_vertical_position" ).slider({
            min: -50,
            max: 50,
            value: $( "#vertical-position" ).val(),
            slide: function( event, ui ) {
                $( "#vertical-position" ).val( ui.value );
				shadow_text();
			}
		});

        $( "#slider_horizontal_position" ).slider({
            min: -50,
            max: 50,
            value: $( "#horizontal-position" ).val(),
            slide: function( event, ui ) {
                $( "#horizontal-position" ).val( ui.value );
				shadow_text();
            }
		});

        $( "#slider_blur_radius" ).slider({
            min: 0,
            max: 50,
            value: $( "#blur-radius" ).val(),
            slide: function( event, ui ) {
                $( "#blur-radius" ).val( ui.value );
				shadow_text();
            }
		});
		
		$( "#use_shadow_text" ).click(function() {
			shadow_text();
		});

		// shadow (box) ---------------------------
		function shadow_box() {
			if(!$("#use_shadow_box").is(":checked")){
				$( "#target_btn" ).css("-moz-box-shadow","");
				$( "#target_btn" ).css("-webkit-box-shadow","");
				$( "#target_btn" ).css("box-shadow","0px 0px 0px #000");
				code_result();
				return;
			}
		
			tmp1 = $("#horizontal-position-box").val();
			tmp2 = $("#vertical-position-box").val();
			tmp3 = $("#blur-radius-box").val();
			tmp4 = $("#spread-radius-box").val();
			tmp5 = '';
			if($("#inset").is(":checked")){
				tmp5 = "inset ";
			}
			$( "#target_btn" ).css("-moz-box-shadow", tmp5 + tmp1 + "px " + tmp2 + "px " + tmp3 + "px " + tmp4 + "px " + boxShadowColor() );
			$( "#target_btn" ).css("-webkit-box-shadow", tmp5 + tmp1 + "px " + tmp2 + "px " + tmp3 + "px " + tmp4 + "px " + boxShadowColor() );
			$( "#target_btn" ).css("box-shadow", tmp5 + tmp1 + "px " + tmp2 + "px " + tmp3 + "px " + tmp4 + "px " + boxShadowColor() );
			code_result();
		};
		
		$( "#inset" ).button().click(function() {
			shadow_box();
		});
		
        $( "#slider_vertical_position_box" ).slider({
            min: -50,
            max: 50,
            value: $( "#vertical-position-box" ).val(),
            slide: function( event, ui ) {
                $( "#vertical-position-box" ).val( ui.value );
				shadow_box();
            }
		});

        $( "#slider_horizontal_position_box" ).slider({
            min: -50,
            max: 50,
            value: $( "#horizontal-position-box" ).val(),
            slide: function( event, ui ) {
                $( "#horizontal-position-box" ).val( ui.value );
				shadow_box();
            }
		});

        $( "#slider_blur_radius_box" ).slider({
            min: 0,
            max: 50,
            value: $( "#blur-radius-box" ).val(),
            slide: function( event, ui ) {
                $( "#blur-radius-box" ).val( ui.value );
				shadow_box();
            }
		});

        $( "#slider_spread_radius_box" ).slider({
            min: -50,
            max: 50,
            value: $( "#spread-radius-box" ).val(),
            slide: function( event, ui ) {
                $( "#spread-radius-box" ).val( ui.value );
				shadow_box();
            }
		});
		
		$( "#use_shadow_box" ).click(function() {
			shadow_box();
		});
		
		$( "#use_style" ).click(function() {
			code_result();
		});
		
	
		//---------------- Result --------------------
		function code_result() {
			//basic
			btntext					= $("#btn_text").val();
			btnclass				= $("#btn_class").val();
			btnfont					= $("#btn_font").val();
			btnbold = "normal";
			if($("#btn_bold").is(":checked")){
				btnbold = "bold";
			}

			//size
			fontsize 				= $("#font-size").val();
			boderradius				= $("#boder-radius").val();
			bodersize 				= $("#boder-size").val();
			verticalsize 			= $("#vertical-size").val();
			horizontalsize 			= $("#horizontal-size").val();

			//shadow (text)
			horizontalposition 		= $("#horizontal-position").val();
			verticalposition 		= $("#vertical-position").val();
			blurradius 				= $("#blur-radius").val();

			//shadow (box)
			horizontalpositionbox	= $("#horizontal-position-box").val();
			verticalpositionbox 	= $("#vertical-position-box").val();
			blurradiusbox 			= $("#blur-radius-box").val();
			spreadradiusbox	 		= $("#spread-radius-box").val();
			inset = '';
			if($("#inset").is(":checked")){
				inset = "inset";
			}
		
			code1 = "<a href=\"#\" class=\""+btnclass+"\">"+btntext+"</a>";
			$( "#code1" ).val( code1 );
			
			bgGradient_Top 		= Number(bgGradient()) + 5;
			bgGradient_Bottom 	= 100 - Number(bgGradient());

			code2 = "";
			
			if($("#use_style").is(":checked")){
				code2 =
				"<style type=\"text/css\">\r\n";
			}

			code2 = code2 +
			"."+btnclass+" {\r\n"+
			"	font-size:"+fontsize+"px;\r\n"+
			"	font-family:"+btnfont+";\r\n"+
			"	font-weight:"+btnbold+";\r\n"+
			"	-moz-border-radius:"+boderradius+"px;\r\n"+
			"	-webkit-border-radius:"+boderradius+"px;\r\n"+
			"	border-radius:"+boderradius+"px;\r\n"+
			"	border:"+bodersize+"px solid "+borderColor()+";\r\n"+
			"	padding:"+verticalsize+"px "+horizontalsize+"px;\r\n"+
			"	text-decoration:none;\r\n"+
			"	background:-moz-linear-gradient( center top, "+bgTopColor()+" "+bgGradient_Top+"%, "+bgBottomColor()+" "+bgGradient_Bottom+"% );\r\n"+
			"	background:-ms-linear-gradient( top, "+bgTopColor()+" "+bgGradient_Top+"%, "+bgBottomColor()+" "+bgGradient_Bottom+"% );\r\n"+
			"	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='"+bgTopColor()+"', endColorstr='"+bgBottomColor()+"');\r\n"+
			"	background:-webkit-gradient( linear, left top, left bottom, color-stop("+bgGradient_Top+"%, "+bgTopColor()+"), color-stop("+bgGradient_Bottom+"%, "+bgBottomColor()+") );\r\n"+
			"	background-color:"+bgTopColor()+";\r\n"+
			"	color:"+fontColor()+";\r\n"+
			"	display:inline-block;\r\n";
			
			if($("#use_shadow_text").is(":checked")){
				code2 = code2 +
				"	text-shadow:"+horizontalposition+"px "+verticalposition+"px "+blurradius+"px "+textShadowColor()+";\r\n";
			}
			
			if($("#use_shadow_box").is(":checked")){
				code2 = code2 +
				" 	-webkit-box-shadow:"+inset+" "+horizontalpositionbox+"px "+verticalpositionbox+"px "+blurradiusbox+"px "+spreadradiusbox+"px "+boxShadowColor()+";\r\n"+
				" 	-moz-box-shadow:"+inset+" "+horizontalpositionbox+"px "+verticalpositionbox+"px "+blurradiusbox+"px "+spreadradiusbox+"px "+boxShadowColor()+";\r\n"+
				" 	box-shadow:"+inset+" "+horizontalpositionbox+"px "+verticalpositionbox+"px "+blurradiusbox+"px "+spreadradiusbox+"px "+boxShadowColor()+";\r\n";
			}
			
			code2 = code2 +
			"}."+btnclass+":hover {\r\n"+
			"	background:-moz-linear-gradient( center top, "+bgBottomColor()+" "+bgGradient_Top+"%, "+bgTopColor()+" "+bgGradient_Bottom+"% );\r\n"+
			"	background:-ms-linear-gradient( top, "+bgBottomColor()+" "+bgGradient_Top+"%, "+bgTopColor()+" "+bgGradient_Bottom+"% );\r\n"+
			"	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='"+bgBottomColor()+"', endColorstr='"+bgTopColor()+"');\r\n"+
			"	background:-webkit-gradient( linear, left top, left bottom, color-stop("+bgGradient_Top+"%, "+bgBottomColor()+"), color-stop("+bgGradient_Bottom+"%, "+bgTopColor()+") );\r\n"+
			"	background-color:"+bgBottomColor()+";\r\n";

			code2 = code2 +
			"}."+btnclass+":active {\r\n"+
			"	position:relative;\r\n"+
			"	top:1px;\r\n"+
			"}\r\n"+
			"/* CSS Button Generator */\r\n";

			if($("#use_style").is(":checked")){
				code2 = code2 +
				"</style>";
			}
			
			$( "#code2" ).val( code2 );
		}

		code_result();
    });